<template>
  <div>
    <el-dialog :title="'选择分配的用户'" :visible.sync="Configuration" width="1050px" :append-to-body="true" :close-on-click-modal="false">
      <el-row :span="24">
        <el-col :span="6">
          姓名：
          <el-input v-model="realName" placeholder="请输入内容"></el-input>
        </el-col>

        <el-col :span="6">
          &nbsp;&nbsp; &nbsp;&nbsp;
          所属部门：
          <el-input v-model="deptname" placeholder="请输入内容"></el-input>
        </el-col>

        <el-button type="primary" @click="findByUser()">查询</el-button>&nbsp;&nbsp;
        <el-button type="primary" @click="resets()">重置</el-button>
      </el-row>

      <br />
      <br />
      <br />
      <el-table
        ref="multipleTable"
        :data="assessInfoData"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
        @row-click="RowClick"
      >
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="序号" type="index" width="175" align="center"></el-table-column>
        <el-table-column label="姓名" prop="realName" align="center" width="220"></el-table-column>
        <el-table-column prop="deptName" label="所属部门" align="center" width="220"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click.native.stop="handleRowClick(scope.row)">选择</el-button>
          </template>
        </el-table-column>
      </el-table>

      <div slot="footer">
        <el-button type="primary" v-throttle="[save]">确 定</el-button>
        <el-button @click="toggleSelection()">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import dbl from '@/utils/dbl'
import axios from 'axios'

export default {
  data () {
    return {
      Configuration: false,
      assessInfoData: [],
      multipleSelection: [],
      index: "",
      realName: '',
      deptname: '',
      test: {
        userId: '',
        data: "",
        index: ''
      }
    }
  },
  methods: {
    findByUser () {
      const config = {
        headers: { 'Authorization': dbl.get('token'), }
      }
      var keys = "?s=1"
      if (this.realName != '') {
        keys += "&realName=" + this.realName
      }
      if (this.deptname != '') {
        keys += "&deptName=" + this.deptname
      }
      axios.get(" /api/flowTaskResultAssignee/doUserTaskList" + keys, config).then(response => {
        this.assessInfoData = response.data.data.records
      }).catch(e => {
      })
    },
    resets () {
      this.realName = ''
      this.deptname = ''
      this.test = {
        userId: '',
        data: "",
        index: ''
      }
    },
    save (rows) {
      this.test.index = this.index
      // (this.multipleSelection)
      for (var i = 0; i < this.multipleSelection.length; i++) {
        if (i == 0) {
          this.test.data = this.multipleSelection[i].realName;
          this.test.userId = this.multipleSelection[i].userId
        }
        else {
          this.test.data += "、" + this.multipleSelection[i].realName;
          this.test.userId += "、" + this.multipleSelection[i].userId
        }

      }
      this.$emit('loadsuc', this.test);
      this.multipleSelection = []
      this.toggleSelection(rows)
    },
    toggleSelection (rows) {
      this.Configuration = false
      if (rows) {
        rows.forEach(row => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.multipleTable.clearSelection();
      }
    },
    handleRowClick (row, column, event) {
      this.$refs.multipleTable.toggleRowSelection(row);
    },
    RowClick (row, column, event) {
      this.$refs.multipleTable.toggleRowSelection(row);
    },
    handleSelectionChange (val) {
      this.multipleSelection = val
    },
    show (data) {
      this.index = data
      this.test.index = this.index
      this.Configuration = true
      this.getList()
    },
    getList () {
      const config = {
        headers: { 'Authorization': dbl.get('token'), }
      }
      axios.get(" /api/flowTaskResultAssignee/doUserTaskList", config).then(response => {
        this.assessInfoData = response.data.data.records
      }).catch(e => {
      })
    },

  }
}
</script>

<style scoped lang='scss'>
@include formWrap(4);
</style>

